import { createRouter, createWebHistory } from "vue-router";
import LayoutView from "@/views/layout/LayoutView.vue";
import LoginView from "@/views/login/LoginView.vue";
import { useGlobalStore } from "@/store/global";
import type { App } from "vue";
// 懒加载
const NotFound = () => import('@/views/404/NotFound.vue');

// 以对象的形式，获取到views目录下所有的.vue的文件
const modules = import.meta.glob("../views/**/*.vue");


const routes = [
    // 重定向
    { path: '/', redirect: '/admin/index' },
    {
        // 布局页的路由
        path: '/admin',
        component: LayoutView,
        name: 'LayoutView',
        // redirect: '/admin/index',
    },
    { path: '/admin/login', component: LoginView },
    { path: '/:pathMatch(.*)*', component: NotFound }
]

const router = createRouter({
    // 设置路由模式（history模式）
    history: createWebHistory(),
    // 配置路由对象（设置路径URL和组件之间的关联关系）
    routes: routes
})


// 路由白名单(不需要登录也可以访问)
const WHITE_LIST = ['/admin/login'];

// 全局前置守卫
router.beforeEach(async (to) => {
    const token = localStorage.admin_token;
    // 进入if，表示当前用户已经登录，但是还想进入登录页
    if (token && to.path == '/admin/login') {
        return '/admin/index';  // 直接跳转到系统主页
    }

    // 进入if，表示当前想要进入的页面，不属于白名单页面
    if (!WHITE_LIST.includes(to.path)) {

        // 判断用户是否登录
        // 进入if，表示没有token，说明用户没登录
        if (!token) {
            return '/admin/login'
        }
    }
    // 1. 调用use方法得到仓库对象
    const globalStore = useGlobalStore();
    // 2. 通过仓库对象拿到内部的数据或方法
    await globalStore.getAdminInfoByTokenAction();
    const permissionData = globalStore.permissionData;
    // 如果有动态的权限数据，才进入if，去添加动态的路由
    if (permissionData.length > 0) {
        if (router.getRoutes().length == routes.length) {
            // 在该函数中，递归遍历权限数据，动态添加路由
            deepAddRoutes(permissionData);
            return {
                ...to,
            }
        }
    }
})


export function toLogin() {
    router.replace('/admin/login');
    // localStorage.clear();  // 清空localStorage
    localStorage.removeItem('admin_token');  // 删除admin_token
}


function deepAddRoutes(permissionData: any[]) {
    permissionData.forEach((item: any) => {
        if (item.component_path) {
            router.addRoute('LayoutView', {
                path: item.route_path,
                // 通过路径加载对应的组件对象
                // component: () => import("../views" + item.component_path + '.vue'), 
                component: modules[`../views${item.component_path}.vue`]
            })
        }
        if (item.children) {
            deepAddRoutes(item.children)
        }
    })
}


// export default 将 router 暴露给外部其他文件使用
// export default router;
export function registerRouter(app: App) {
    app.use(router);
}